 <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>新增试卷</title>
</head>
<body>
<style type="text/css">
ul li{
	list-style:none;
	color:#6E6E6E;
	font-size:13px;
}
#testconpanylooks{
	margin:auto;
	display: block;
}
.interviewones{
	width:1000px;
	height:40px;
	font-size:16px;
	color:#19AA8D;
	display:block;
	margin:auto;
	background-color:#F2F2F2;
	text-align: center;
	line-height: 40px;
}
.interviewtesttwo{
	width: 900px;
    height: 160px;
    display: block;
    margin:auto;
}
.interview-testleft{
	width: 440px;
    height: 160px;
    float: left;
    display: block;
    margin-left: 40px;
}
.interview-testright{
	width: 405px;
    height: 160px;
    float: right;
    display: block;
    margin-right:-80px;
}
.insertbottom{
	width:1000px;
	height:30px;
	box-shadow: 0 -2px 13px #bee3e6;
	display: block;
	position: fixed;
	bottom: 0px;
	margin-left:90px;
}
.insertsix{
	width:700px;
	height:25px;
	float:left;
	margin:2px;
}
.insertseven{
	width:200px;
	height:25px;
	float:right;
	margin:2px;
}
.insertsix ul li{
	float:left;
	color:white;
	margin-top:3px;
	margin-left: 10px;
}
.return{
	width:60px;
	height:20px;
	border:none;
	color:white;
}
.itemchoose{
	width:60px;
	height:20px;
	border: none;
}
button {
	border-radius:3px;
	cursor:pointer;
	color:white;
}
.icon-test-tianjia{
	padding-left: 20px;
	background:url('static/easyui/themes/icons/jiahao.png') no-repeat 5% 50%;
	background-color:#2BB097;
}
.save{
	width:60px;
	height:20px;
	border:none;
	color:white;
	margin-left: 20px;
}
.icon-test-fanhui{
		padding-left: 20px;
		background:url('static/easyui/themes/icons/fanhui.png') no-repeat 5% 50%;
		background-color:#EC971F;
}
.icon-test-baocun{
		padding-left: 20px;
		background:url('static/easyui/themes/icons/baocun.png') no-repeat 5% 50%;
		background-color:#13826B;
}
.interview-testleft ul li,.interview-testright ul li{
		margin-top:10px;
}
.insert-centers{
	width: 480px;
    height: 140px;
    float: left;
}
.danx-title{
 	width:480px;
 	height:30px;
 	display:block;
 	font-size:13px;
 	color:#666666;
 	margin-top:10px;
 	margin-left:10px;
 }
 .danx-anser{
 	width:480px;
 	height:105px;
 	display:block;
 	border-top: solid 1px #F3F3F3;
 }
 .oneanser{
 	width:480px;
 	height:30px;
 	border-bottom: solid 1px #F3F3F3;
 }
  .insert-staff{
 	width:95px;
 	height:135px;
 	float:right;
 	border-bottom: solid 1px #F3F3F3;
 	border-left: solid 1px #F3F3F3;
 }
 .danx-staff{
 	width: 95px;
    height: 70px;
    float: right;
 	font-size:13px;
 	line-height:40px;
    font-size:#666666;
    text-align: center;
    border-bottom: solid 1px #F3F3F3;
 }
 .danx-people{
 	width:95px;
 	height:70px;
 	font-size:13px;
 	line-height:40px;
    color:#666666;
 	text-align: center;
 }
 .insert-continue{
 	width:120px;
 	height:30px;
 	display: block;
 	margin:auto;
 }
 .continue{
 	width:120px;
 	height:22px;
 }
 .items-timu{
 	width: 700px;
    height: 400px;
    margin:auto;
 }
 .bottom-cz{
 	width:170px;
 	height:30px;
 	float:right;
    display: block;
    position: absolute;
    bottom: 0px;
    right:0px;
    margin-left: 90px;
 }
 
 #testquxiao,#testqueding,#btooqx,#btooqd,#pandqx,#pandqd,#tiankqx,#tiankqd,#jiandqx,#jiandqd{
 	width:60px;
 	height:20px;
 	background-color:#2BB097;
 	color:white;
 	font-size:13px;
 	margin-left:15px;
 	cursor: pointer;
 }
 #continues,#jx{
 	width:120px;
 	height:22px;
 }
 .tiankong-anser{
 	width:480px;
 	height:94px;
 	border: solid 1px #F3F3F3;
 }
  .jianda-anser{
 	width:480px;
 	height:135px;
 	border: solid 1px #F3F3F3;
 }
 .shurutitle{
 	font-size:13px;
 	color:#666666;
 	margin-left:10px;
 	line-height:70px;
 }
 #inserttest-danx{
 	width:700px;
 	height:400px;
 	margin:auto;
 }
 #inserttest-jiand{
 	width:700px;
 	height:400px;
 	margin:auto;
 }
 .insertitems{
	width:800px;
	height:184px;
	margin:20px auto;
	display:block;
	border:solid 1px #F3F3F3;
}
.insert-contents{
	width:800px;
	height:25px;
	margin:auto;
	border-bottom:solid 1px #F3F3F3;
}
.insertfirst{
	width:580px;
	height:25px;
	color:#19AA8D;
	font-size:13px;
	line-height:25px;
	text-align:center;
	font-weight:bold;
	float:left;
}
.inserttwo{
	width:216px;
	height:25px;
	color:#19AA8D;
	font-size:13px;
	line-height:25px;
	text-align:center;
	font-weight:bold;
	float:left;
	border-left:solid 1px #F3F3F3;
}
.insert-center{
	width:800px;
	height:30px;
	margin:auto;
	border-bottom:solid 1px #F3F3F3;
}
.insertthree{
	width:800px;
	height:30px;
	display: block;
	margin:auto;
	line-height:30px;
}
.testleft{
	with:500px;
	height:30px;
	color:#19AA8D;
	font-size:13px;
	float:left;
	font-weight:bold;
}
.insertright{
	width: 160px;
    height: 20px;
    float: right;
    margin-top: 5px;
}
.insert-bianji{	
	width:60px;
	height:20px;
	font-size:13px;
	border: none;
	color:white;
	margin-left:20px;
}
.icon-items-bianji{
	padding-left: 20px;
	background:url('static/easyui/themes/icons/bianji.png') no-repeat 5% 50%;
	background-color:#2BB097;
}
.insert-nrxx{
	width:800px;
	height:130px;
	display: block;
	margin:auto;
}
.insertfour{
	width:580px;
	height:130px;
	float:left;
	margin-top:-4px;
}
.insertfive{
	width:215px;
	height:130px;
	float:right;
	margin-top:-4px;
	text-align:center;
	line-height:150px;
	font-size:14px;
	border-left:solid 1px #F3F3F3;
}
.strt_one{
	padding: 25px;
}
.datagrid-header-row td{
		background: #E6E6E6;
		color: #19AA9C;
	    font-size: 14px;
	    font-weight: 700;
	    text-align: center;
	}
	.datagrid-row td{
		background: #fff;
		font-size: 12px;
		text-align: center;
	}		
		ul li{
	list-style:none;
}
.danxuan,.duoxuan,.panduan,.jianda{
	display: table;
}
.titletext{
	font-size: 
}
.wuxuanxiang{
	font-size: 20px;
	line-height: 100px;
	margin-left: 50px;
}
.hidden{
	display: none;
}
</style>
<script type="text/javascript">
var zongfen=0;
$(function(){
	//新增试卷
	$("#testsure").click(function(){
		//名称
		var ttestname = $("#ttestname").val();
		//时长
		var ttesttnums = $("#ttesttnums").val();
		//总分
		var ttestavrage = $("#ttestavrage").val();
		//创建人
		var Staff_id = $("#Staff_id").val();
		//知识组
		var ttestledge = $("#ttestledge").val();
		//创建主题
		var ttesttheme = $("#ttesttheme").val();
		var id=new Array();
		for (var i = 0; i < $(".hidden").length; i++) {
			id[i]=$(".hidden").eq(i).html();
		}
		$.ajax({
			url:"add-testinserts",
			type:"post",
			data:{
				"ttestname":ttestname,
				"ttesttnums":ttesttnums,
				"ttestavrage":ttestavrage,
				"Staff_id":Staff_id, 
				"ttestledge":ttestledge,
				"ttesttheme":ttesttheme,
				"id":id.toString()
				}
		})
		$("#content-admin").panel('open').panel('refresh','testconpany');
		$("#testconpanylooks").window("close");	
		
	})		
});
$(function(){	
	//点击返回按钮
	$("#testreturn").click(function(){
	add("testconpany");
	
});
	function timu(str,table){
		table.datagrid({
			url:'sert_dan',
			columns:[[
				{field:'titemid',checkbox:true,title:'选',width:50,align:'center'},
				{field:'test',title:'#',width:28,align:'center'},
				{field:'titemdate',title:'题目创建时间',width:172,align:'center',
					formatter:function(val,rec){
						return formattimes(val);
		        	}
				},
				{field:'tiemdu',title:'难易度',width:50,align:'center'},
				{field:'titemall',title:'题目内容',width:150,align:'center'},
				{field:'titemanswer',title:'题目答案',width:100,align:'center'},
				{field:'titemremark',title:'备注',width:100,align:'center'}
			]],
			queryParams:{str:str},
	    	pagination:true,
	    	pageNumber:1,
	    	pageSize:5,
	    	pageList:[5,10,15]
		});
	}
	function formattimes(value,row,index){
		var date = new Date(value);
	    var year = date.getFullYear().toString();
	    var month = (date.getMonth() + 1);
	    var day = date.getDate().toString();
	    var hour = date.getHours().toString();
	    var minutes = date.getMinutes().toString();
	    if (month < 10) {
	        month = "0" + month;
	    }
	    if (day < 10) {
	        day = "0" + day;
	    }
	    if (hour < 10) {
	        hour = "0" + hour;
	    }
	    if (minutes < 10) {
	        minutes = "0" + minutes;
	    }
	   
	    return year + "-" + month + "-" + day + " " + hour + ":" + minutes ;
	}
	function shencheng(table,type,gui){
		var array=table.datagrid("getChecked");
		for (var i = 0; i < array.length; i++) {
			$.ajax({
				url:"chaxun_dan",
				type:"post",
				dateType:"json",
				data:{id:array[i]['titemid']},
				success: function (result) {
					var div1=$("<div>");
					var div2=$("<div>");
					var div3=$("<div>");
					var div4=$("<div>");
					var div5=$("<div>");
					var div6=$("<div>");
					var div7=$("<div>");
					var div8=$("<div>");
					var div9=$("<div>");
					var div10=$("<div>");
					var div11=$("<div>");
					var span1=$("<span>");
					var span2=$("<span>");
					var span3=$("<span>");
					var span4=$("<span>");
					var span5=$("<span>");
					var span6=$("<span>");
					var span7=$("<span>");
					var span8=$("<span>");
					var span9=$("<span>");
					var div12=$("<div>");
					var ul=$("<ul>");
					var li1=$("<li>");
					var li2=$("<li>");
					var li3=$("<li>");
					var li4=$("<li>");
					var btn1=$("<button>");
					div1.addClass("insertkstm");
					div2.addClass("insertitems");
					div3.addClass("insert-contents");
					div4.addClass("insert-center");
					div5.addClass("insert-nrxx");
					div6.addClass("insertfirst");
					div7.addClass("inserttwo");
					div8.addClass("insertthree");
					div9.addClass("insertright");
					div10.addClass("insertfour");
					div11.addClass("insertfive");
					btn1.addClass("insert-bianji");
					btn1.addClass("icon-items-bianji");
					span3.addClass("testleft");
					span9.addClass("wuxuanxiang");
					div12.addClass("hidden");
					//上
					div12.html(result['titemid']);
					div1.append(div12);
					span1.html("题目");
					span2.html("创建人");
					div6.append(span1);
					div7.append(span2);
					div3.append(div6);
					div3.append(div7);
					div2.append(div3);
					
					//中
					btn1.html("删除");
					div9.append(btn1);
					btn1.click(function(){
						$.messager.confirm('确认窗口', '确定删除此题?', function(r){
							if (r){
								if(type==4){
									zongfen-=20;
								}else{
									zongfen-=5;
								}
								div1.remove();
								$.ajax({
									url:"shanchu",
									type:"post",
									dateType:"json",
									data:{id:result['titemid'],str:result['titemtypes']},
									success: function (result) {
									
									}
								});
									}
						});
						
					});
					span3.html(result['titemall']);
					div8.append(span3);
					div8.append(div9);
					div4.append(div8);
					div2.append(div4);
					//下
					if(type==1||type==2){
						span4.html(result['a']);
						li1.html("A:");
						li1.append(span4);
						span5.html(result['b']);
						li2.html("B:");
						li2.append(span5);
						span6.html(result['c']);
						li3.html("C:");
						li3.append(span6);
						span7.html(result['d']);
						li4.html("D:");
						li4.append(span7);
						ul.append(li1);
						ul.append(li2);
						ul.append(li3);
						ul.append(li4);
						div10.append(ul);
					}else{
						span9.html("无选项")
						div10.append(span9);
					}
					span8.html(result['staff_name']);
					div11.append(span8);
					div5.append(div10);
					div5.append(div11);
					div2.append(div5);
					div1.append(div2);
					gui.append(div1);
					if(type==4){
						zongfen+=20;
					}else{
						zongfen+=5;
					}
					$("#ttestavrage").val(zongfen);
		        }
			});
			
		}
	}
	$("#zhezhao").hide();
	//点击单选按钮弹框
	fuzhi();
	$("#danxuan").click(function(){
		timu("单选",$("#table1"));
		$("#inserttest-danx").window("open");
		$("#zhezhao").show();
	})
	function fuzhi(){
		/*点击单选按钮弹框中的取消*/
		$("#testquxiao").click(function(){
			$("#inserttest-danx").window("close");
			 $("#zhezhao").hide();
		})
	/*点击单选按钮弹框中的确定*/
		$("#testqueding").click(function(){
			xuanzhong($("#table1"),$("#inserttest-danx"),$("#zhezhao"),1,$(".danxuan"));
		});
		/*点击多选按钮弹框中的取消*/
		$("#btooqx").click(function(){
			$("#insertest-duox").window("close");
			 $("#zhezhao").hide();
		})
	/*点击多选按钮弹框中的确定*/
		$("#btooqd").click(function(){
			xuanzhong($("#table2"),$("#inserttest-duox"),$("#zhezhao"),2,$(".duoxuan"));
		})
		/*点击判断按钮弹框中的取消*/
		$("#pandqx").click(function(){
			$("#inserttest-pand").window("close");
			 $("#zhezhao").hide();
		})
	/*点击判断按钮弹框中的确定*/
		$("#pandqd").click(function(){
			xuanzhong($("#table3"),$("#inserttest-pand"),$("#zhezhao"),3,$(".panduan"));
		})	
		/*点击简答按钮弹框中的取消*/
				$("#jiandqx").click(function(){
					$("#inserttest-jiand").window("close");
					 $("#zhezhao").hide();
				})
			/*点击简答按钮弹框中的确定*/
				$("#jiandqd").click(function(){
					xuanzhong($("#table5"),$("#inserttest-jiand"),$("#zhezhao"),4,$(".jianda"));
				})
	}
	function xuanzhong(table,zhe,zhao,type,gui){
		var c = table.datagrid("getSelections");
		if(c[0]==undefined){
			alert("请选择一行");
		}else{
			shencheng(table,type,gui);
			zhe.window("close");
			zhao.hide();
		}
	}
	//点击多选按钮弹框
	$("#duoxuan").click(function(){
		timu("多选",$("#table2"));
		$("#insertest-duox").window("open");
		$("#zhezhao").show();
	})
	
	//点击判断按钮弹框
		$("#panduan").click(function(){
			timu("判断",$("#table3"));
			$("#inserttest-pand").window("open");
			$("#zhezhao").show();
		})
		
				//点击简答按钮弹框
			$("#jianda").click(function(){
				timu("简答",$("#table5"));
				$("#inserttest-jiand").window("open");
				$("#zhezhao").show();
			})
			
});
//试卷创建者
$('#Staff_name').combogrid({
    panelWidth:200,
    url:'select_sousuoKuang',
    singleSelect:true,
    idField:'Staff_name',
    treeField:'Staff_name',
    columns:[[
    	{field:'sortable',title:'#',width:35,align:'center'},
    	{field:'Staff_id',hidden:true},
        {field:'Staff_name',title:'负责人',width:160,align:'center'}
    ]],
    onClickRow:function(rowIndex, rowData){
		$("#Staff_id").val(rowData['staff_id']);
	}
});
//点击窗口自带的关闭按钮关闭窗口(单选)
$(document).ready(function(){		    
	   $('#inserttest-danx').window({
	       onBeforeClose:function(){ 
	    	   $("#zhezhao").hide();
	       }
	   });
	});
	//点击窗口自带的关闭按钮关闭窗口(多选)
$(document).ready(function(){		    
	   $('#insertest-duox').window({
	       onBeforeClose:function(){ 
	    	   $("#zhezhao").hide();
	       }
	   });
	});
	//点击窗口自带的关闭按钮关闭窗口(判断)
$(document).ready(function(){		    
	   $('#inserttest-pand').window({
	       onBeforeClose:function(){ 
	    	   $("#zhezhao").hide();
	       }
	   });
	});
	//点击窗口自带的关闭按钮关闭窗口(简答)
$(document).ready(function(){		    
	   $('#inserttest-jiand').window({
	       onBeforeClose:function(){ 
	    	   $("#zhezhao").hide();
	       }
	   });
	});
</script>
<div class="insert-test" id="testconpanylooks">
	<div class="interviewones"><span>新增试卷</span></div>
		<div class="interviewtesttwo">
		<input type="hidden" id="Staff_id">
			<div class="interview-testleft">
			   <ul style="list-style:none;width: 260px;height: 150px;">
			   		<li><span>名称：</span><input id="ttestname" type="text" style="color:#777777;width:200px;"></li>
			   		<li><span>时长：</span><input id="ttesttnums" type="text" style="color:#777777;width:200px;"></li>
			   		<li><span>总分：</span><input id="ttestavrage" type="text" style="color:#777777;width:200px;"></li>
			   </ul>
			</div>
			<div class="interview-testright">
				  <ul style="list-style:none;width:280px;height:150px;">
				  <li><span style="margin-left: -13px;">知识组：</span><input id="ttestledge" type="text" style="color:#777777;width:200px;"></li>
			   		<li><span style="margin-left: -13px;">创建者：</span><input type="text" id="Staff_name" style="width:203px;"></li>
			   		<li><span>主题：</span><input id="ttesttheme" type="text" style="color:#777777;width:200px;"></li>
			   </ul>
			</div>
			</div>
		<div class="timu">
			<div class="danxuan">
			<h2>
			（一）单选题
			</h2>
			</div>
			<div class="duoxuan">
			<h2>
			（二）多选题
			</h2>
			</div>
			<div class="panduan">
			<h2>
			（三）判断题
			</h2>
			</div>
			<div class="jianda">
			<h2>
			（四）简答题
			</h2>
			</div>
		</div>
		<div class="insertbottom">
		<div class="insertsix">
		  <ul style="margin:0;">
			<li><button id="danxuan" class="itemchoose icon-test-tianjia">单选</button></li>
			<li><button id="duoxuan" class="itemchoose icon-test-tianjia">多选</button></li>
			<li><button id="panduan" class="itemchoose icon-test-tianjia">判断</button></li>
			<li><button id="jianda" class="itemchoose icon-test-tianjia">简答</button></li>
		  </ul>
		</div>
		<div class="insertseven">
			<button id="testreturn" class="return icon-test-fanhui">返回</button>
			<button id="testsure" class="save icon-test-baocun">确定</button>
		</div>
	</div>
</div>

<!-- 新增单选 -->
<div id="zhezhao" style="width:1366px;height:736px;position:fixed; top:0px;
background: rgba(0, 0, 0, 0.5);text-align:center;left:0;z-index:10;display:none;" >
 <div id="inserttest-danx" class="easyui-window" title="新增单选题" data-options="closed:true,minimizable:false,maximizable:false,collapsible:false">
 	<div class="items-timu">
 		<div class="neirong">
 			<div class="strt_one">
 				<table id="table1" class="easyui-datagrid" data-options="width:650,height:300">
 				
 				</table>
 			</div>
 		</div>
 	<div class="bottom-cz">
 		<button id="testquxiao">取消</button>
 		<button id="testqueding">确定</button>
 	</div>
 </div>
 </div>
 </div>
 
 <!-- 新增多选 -->
<div id="zhezhao" style="width:1366px;height:736px;position:fixed; top:0px;
background: rgba(0, 0, 0, 0.5);text-align:center;left:0;z-index:10;display:none;" >
 <div id="insertest-duox" class="easyui-window" title="新增多选题" data-options="closed:true,minimizable:false,maximizable:false,collapsible:false">
 	<div class="items-timu">
 		<div class="neirong">
 			<div class="strt_one">
 				<table id="table2" class="easyui-datagrid" data-options="width:650,height:300">
 				
 				</table>
 			</div>
 		</div>
 	<div class="bottom-cz">
 		<button id="btooqx">取消</button>
 		<button id="btooqd">确定</button>
 	</div>
 </div>
 </div>
 </div>
 
 <!-- 新增判断题 -->
 <div id="zhezhao" style="width:1366px;height:736px;position:fixed; top:0px;
background: rgba(0, 0, 0, 0.5);text-align:center;left:0;z-index:10;display:none;" >
 <div id="inserttest-pand" class="easyui-window" title="新增多选题" data-options="closed:true,minimizable:false,maximizable:false,collapsible:false">
<div class="items-timu">
 		<div class="neirong">
 			<div class="strt_one">
 				<table id="table3" class="easyui-datagrid" data-options="width:650,height:300">
 				
 				</table>
 			</div>
 		</div>
 	<div class="bottom-cz">
 		<button id="pandqx">取消</button>
 		<button id="pandqd">确定</button>
 	</div>
 </div>
 </div>
 </div>
 
  
   <!-- 新增简答题 -->
 <div id="zhezhao" style="width:1366px;height:736px;position:fixed; top:0px;
background: rgba(0, 0, 0, 0.5);text-align:center;left:0;z-index:10;display:none;" >
 <div id="inserttest-jiand" class="easyui-window" title="新增多选题" data-options="closed:true,minimizable:false,maximizable:false,collapsible:false">
	<div class="neirong">
 			<div class="strt_one">
 				<table id="table5" class="easyui-datagrid" data-options="width:650,height:300">
 				
 				</table>
 			</div>
 		</div>
 	<div class="bottom-cz">
 		<button id="jiandqx">取消</button>
 		<button id="jiandqd">确定</button>
 	</div>
 </div>
 </div>
</body>
</html>